草庐IT

Vue3 实现列表虚拟滚动

全部标签

javascript - 按数据属性、字母顺序和数字顺序对列表项进行排序

我想从A-Z然后0-9对这个列表进行排序。y1aecw09g$(".columnsli").sort(sort_li).appendTo('.columns');functionsort_li(a,b){return($(b).data('char'))看了类似的问题,这是我想出的,但它只适用于数字或字母(不是两者)。https://jsfiddle.net/qLta1ky6/ 最佳答案 数字的ASCII码比字母小,所以比较的时候直接加权重就可以了:$(".columnsli").sort(sort_li).appendTo('.c

javascript - 在 vue.js 中重新加载或关闭之前做一些事情

我有一个带有beforeDestroy方法的Vue.JS应用程序,我试图用它在应用程序关闭或重新加载之前将一些数据存储在本地存储中。仅供引用:beforeDestroy:function(){localStorage.setItem('preference',this.preference);...}但是,关闭或重新加载应用程序实际上都不会调用此方法。如何确保在关闭应用程序之前调用此方法? 最佳答案 “关闭”或“重新加载”应用程序的是什么?是浏览器中的用户关闭窗口和/或刷新页面吗?如果是这样,则没有任何东西“被破坏”并且该函数将不会

javascript - 我怎样才能让 `.then()` 保持足够长的时间以实现具有 native promise 的轮询功能?

总结:poll()带有回调的函数可用;我还没有发现任何使用nativepromise。我试图改编一些但没有成功。我还没有解决的问题是,当setTimeout调用的函数的第一个实例结束而没有任何返回时,.then()监听它会将终止视为false和一个reject().then()终止并且不监听以后的返回。问题:如何最好地帮助.then()函数坚持使用resolve()稍后返回或reject()?这篇文章的其余部分是细节。阅读有帮助的内容。可用的投票功能:我喜欢(https://stackoverflow.com/users/1249219/om-shankar)OmShankar在Cal

javascript - 带有 vuex 的 Vue js 使用 v-for 和 v-model 计算属性

我需要将v-for与v-model结合使用。我读了docs并且没有示例说明如何在不在变异处理程序之外执行变异的情况下将它与v-for一起使用。如何在不直接改变属性的情况下在v-for中使用v-model?0{{n}}//componentmethods:{...mapMutations({addToCart:ADD_TO_CART})}, 最佳答案 不确定我是否完全理解您的问题,但请查看以下内容:编辑已更新为使用Vuex-但不是通过v-model,因为那样不会调用所需的突变或操作conststore=newVuex.Store({s

javascript - Vue.js:根据方法对列表进行排序

我正在获取一些原始数据并显示项目列表。每个项目都有一个我用方法生成的复杂属性(不是计算属性)。该属性可能会根据用户输入而改变。是否可以根据该属性对列表项进行排序?HTML:{{calculateComplexProperty(item.time)}}JavaScript:calculateComplexProperty:function(time){//this.distanceisanexternalfactorthatisnotapropertyofthelistitem,//andthatcanbemanipulatedbytheuservarspeed=time*this.di

javascript - 是否可以在 vue-router 中锁定除一条以外的所有路由?安全吗?或者我应该使用另一种方法?

我想做一个在线考试,这个考试有5页,有一个倒计时计时器(120秒),每页有4个问题。120秒后,用户将自动转到下一页,或者他们可以在此之前单击下一步按钮。Laravel5.4和VueJs,用户回答的每个问题都有一个Ajax请求。我想要的是阻止用户看到其他页面。每个页面最多只能显示120秒。用户不应该能够点击后退按钮并查看之前的页面。这可能吗?我想用Vuejs和vue-router创建这个应用程序,但我不知道如何用vue-router实现它,我做了一些研究,但没有得到太多结果!或者也许我不应该使用vue-router,而是使用我自己的简单路由器,例如:$("#page1").show()

javascript - 如何使用 vue 或 javascript 将密码发送到服务器?

我已经创建了用于登录和注册的vue组件。如何将密码发送到服务器?我应该只在客户端使用bcrypt加密密码然后将其发送到Laravel还是应该将普通密码发送到Laravel并使用bcrypt($request->get('password'));什么是好的选择?如果我应该在vue组件中加密密码,我应该使用什么包/函数才能像Laravel/PHP一样加密密码? 最佳答案 在您的javascript代码中并不真的需要加密密码。在HTTPS服务器上提供PHP服务更为重要。浏览器和您的网络服务器之间发送的数据将由SSL/TLS证书加密。这里有

javascript - 使用Vue按秒统计

我正在创建一个小型计时器Vue组件。用户需要能够启动和停止该计时器。到目前为止,这是我的组件:{{time}}exportdefault{props:['order'],data(){return{time:this.order.time_to_complete,isRunning:false,}},methods:{toggleTimer(){varinterval=setInterval(this.incrementTime,1000);if(this.isRunning){//debuggerclearInterval(interval);console.log('timerst

javascript - 页面滚动时将 Div 元素从一个移动到另一个

我看到了一些与我正在寻找的相似但不完全相同的东西。所以我想做的是将元素从一个父div内移动到另一个父div,但只有在用户向下滚动页面一定量后才可以。因此,一旦用户到达页面上的某个点,元素就会移动到另一个点,然后在页面的最顶部淡入。到目前为止,我已经能够创建div元素并让它显示在页面顶部,但只有在用户向下滚动600时才会显示。我现在需要做的是一旦这个元素出现移动其他div页面上的元素出现在其中。不确定我是否解释得很好!因此,如果您查看下面的代码,我现在要做的是在用户向下滚动并出现时将所有div类“Test”移动到“Top”元素内。然后,如果用户再次向上滚动,“Top”元素就会消失,“Te

javascript - Vue js - 找不到图像源时设置替代图像

我在一个有产品列表的网站上工作。每个产品都有对应的图像。我将图像url绑定(bind)到源属性,如下所示。如果找不到图片,我想显示默认图片。我在cshtmlrazor语法中做了如下操作(仅供引用)onerror='this.onerror=null;this.src="@Url.Content("~/images/photo-not-available.jpg")";'我如何在Vue中实现相同的目标? 最佳答案 您可以在Vue中使用@error设置一个onerror处理函数: 关于jav